<template>
	<view class="dissent-view main-basic-box">
		<view class="main-basic-name">异议描述<text class="tip-star">*</text></view>
		<view class="textarea-box">
			<textarea v-model="content" maxlength="200" placeholder="输入详细的意见或建议"></textarea>
			<view class="num-tip">{{content.length}}/200</view>
		</view>
		<view class="main-basic-name">上传图片</view>
		<c-upload :imgs="imgList" :maxNum="9" @delImg="delImg" @addSuccess="addImg"></c-upload>
		<view class="main-basic-btn">
			<van-button block color="#4078E5" @click="submit">提交</van-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgList: [],
				content: '',
				no: ""
			};
		},
		onLoad(e) {
			if (e.no) {
				this.no = e.no
			}
		},
		methods: {
			delImg(index) {
				this.imgList.splice(index, 1)
			},
			addImg(url) {
				this.imgList.push(url)
			},
			async submit() {
				if (this.content.trim() === '') {
					this.$api.showError('请输入您的异议描述！')
					return
				}
				uni.showLoading({
					title: '数据提交中...'
				})
				let ids = []
				// 评价文件
				for (let i = 0; i < this.imgList.length; i++) {
					let fid = await this.$api.requestUploadQNY(this.imgList[i])
					ids.push(fid.asset_id)
				}
				let list = {
					no: this.no,
					file: ids.join(','),
					content: this.content
				}
				this.$api
					.requst(`/gwc/orders/${this.no}/dissent`, list, 'POST')
					.then((res) => {
						this.$api.showError('提交成功！')
						setTimeout(() => {
							uni.navigateBack()
						}, 1000)
					})
			}
		}
	}
</script>

<style scoped lang="scss">
	.dissent-view {
		margin-top: 28rpx;

		.tip-star {
			font-size: 26rpx;
			color: #FF3B51;
			font-weight: normal;
		}

		.textarea-box {
			padding: 32rpx;
			margin-top: 24rpx;
			margin-bottom: 40rpx;
			background: #F1F3F6;
			border-radius: 4rpx;

			.num-tip {
				text-align: right;
				margin-top: 12rpx;
				font-size: 26rpx;
				color: #BEBFC2;
			}
		}
	}
</style>